* {
  margin: 0;
  padding: 0;
}
.box {
  header {
    background: #e3e3e3;
    .header {
      padding: 7px 0;
      width: 76%;
      margin: auto;
      height: 45px;
      .left {
        width: 50%;
        display: inline-block;
        div {
          display: inline-block;
          img {
            max-width: 10vw;
          }
        }
        ul {
          display: inline-block;
          margin-left: 40px;
          li {
            display: inline-block;
            padding: 0 7px;
            &:hover {
                background: white;
            }
          }
        }
      }
      .right {
        height: 100%;
        width: 50%;
        display: inline-block;
        position: relative;
        label {
          position: absolute;
          top: 0;
          left: 0;
          width: 50%;
          input {
            width: 70%;
          }
          span {
            width: 30%;
            padding: 2px 0;
            background: orange;
            color: white;
          }
        }
        .header-time {
          position: absolute;
          top: 0;
          right: 0;
          display: inline-block;
          width: 50%;
          p {
            height: 50%;
            font-size: 10px;
            margin: 0;
          }
        }
      }
    }
  }
  main {
    position: relative;
    .main-top {
      width: 76%;
      margin: auto;
      .top {
        div {
          display: inline-block;
        }
        .img {
          width: 60%;
          img {
            max-width: 100%;
          }
        }
        .ul {
          width: 40%;
          ul {
            width: 90%;
            margin: auto;
            li {
              background: #e3e3e3;
              list-style: none;
              border: 1px solid white;
              &:hover {
                background: white;
              }
              div {
                width: 90%;
                margin: 0 10%;
                span {
                  margin: 0;
                  padding: 0;
                  font-size: 12px;
                }
              }
            }
          }
        }
      }
      .main-main {
        margin: 30px 0;
        position: relative;
        div {
          border: 1px solid #e3e3e3;
          ul {
            padding: 20px 0;
            width: 98%;
            margin: auto;
            li {
              display: inline-block;
              width: 10%;
              padding: 5px 0;
              text-align: center;
              list-style: none;
              font-size: 12px;
              &:hover {
                background: #e3e3e3;
              }
            }
          }
        }
        .span {
          position: absolute;
          top: -12px;
          left: 10%;
          width: 30%;
          border: 0;
          span {
            display: inline-block;
            width: 25%;
            padding: 2.5;
            margin-right: 15px;
            background: #e3e3e3;
            text-align: center;
          }
        }
      }
    }
    .main-zhenmain {
      width: 76%;
      margin: auto;
      .lh {
       
        ul {
          width: 66%;
          li {
            display: inline-block;
            width: 46%;
            margin:15px auto;
            list-style: none;
          }
        }

      }
    }
  }
}

.left {
  float: left;
}
.right {
  float: right;
}
.clear {
  clear: both;
}
